<!--
 * @Description: 
 * @version: 
 * @Author: 周子尧
 * @Date: 2021-09-09 17:00:26
 * @LastEditors: 周子尧
 * @LastEditTime: 2021-11-04 14:50:31
-->
<template>
  <div id="app" :class="{ 'is-component': isComponent }">
    <main-header v-if="lang !== 'play'"></main-header>
    <div
      :class="$route.path === '/zh-CN/home' ? 'main-cnt black' : 'main-cnt  mt'"
    >
      <router-view></router-view>
    </div>
    <main-footer
      v-if="lang !== 'play' && !isComponent && $route.path !== '/zh-CN/home'"
    ></main-footer>
  </div>
</template>

<script>
import { use } from 'main/locale';
import zhLocale from 'main/locale/lang/zh-CN';

const lang = location.hash.replace('#', '').split('/')[1] || 'zh-CN';
const localize = (lang) => {
  switch (lang) {
    case 'zh-CN':
      use(zhLocale);
      break;
    default:
      use(zhLocale);
  }
};
localize(lang);

export default {
  name: 'app',

  computed: {
    lang() {
      return this.$route.path.split('/')[1] || 'zh-CN';
    },
    isComponent() {
      return /^component-/.test(this.$route.name || '');
    }
  },

  watch: {
    lang(val) {
      localize(val);
    }
  },
  mounted() {
    localize(this.lang);
  }
};
</script>
